<template>
    <div>
        <br/>
        <br/>
        <br/>
        <headers/>

        <div class="container">

            <div class="item_column">
                <div class="left"> 
                    
                </div>

                <div class="right"> 

                    <h1>欢迎来到用户中心</h1>

                    <div>
            
                        <!-- {{resourcelist}} -->
            
                        <ul>
            
                            <li v-for="i in resourcelist" :key="i.name">
            
                                <router-link :to="{'path':i.url}">{{i.name}}</router-link>
            
                            </li>
                        </ul>
                    </div>
                   
                </div>

            </div>

        </div>
    </div>
</template>

<script>
import headers from './headers.vue'
import {reactive} from 'vue'
export default{
    components: {
        'headers':headers,
        
    },

    data () {
        return {
            resourcelist:JSON.parse(localStorage.getItem('resourcelist'))
            
        }
    },
    setup() {
        let customerlist = reactive({'data':[{'name':'234'}]})
        let id = localStorage.getItem('id')

         //初始化websocket
         const initWebsocket=()=>{
            let socket = new WebSocket('ws://127.0.0.1:8000/web_conn/'+id)
            //建立
            socket.onopen=function(){
                console.log('建立连接')
            }
            //接收消息
            socket.onmessage=function(msg){
                console.log(msg.data)
                // customerlist.data=JSON.parse(msg.data)
            }
            //关闭
            socket.close=function(e){
                console.log(e)
                console.log('close')
            }
        }


        return{
            customerlist,
            initWebsocket
        }
    },
    methods: {

        

    },

    mounted () {

        this.initWebsocket()
      
    }
}
</script>


<style>
@import url("../assets/style.css");

</style>